<template>
  <div id="app">
    <h1>{{ a | f1 }}</h1>
    <input type="text" v-model="val" />
    {{ val }}
  </div>
</template>

<script>
export default {
  filters: {
    f1(res) {
      console.log(res);
      return res * 10;
    } 
  },
  data() {
    return {
      a: 5,
      val: 'Hello'
    }
  },
  updated() {
    console.log('update');
  }
}
</script>

<style>
#app {
  text-align: center;
}
</style>